.el-tabs {
    :deep(.el-tabs__header) {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    :deep(.el-tabs__header) {
        margin: 0;
    }

    :deep(.el-tabs__active-bar) {
        display: none;
    }
    :deep(.el-tabs__nav-scroll::before) {
        content: '';
        width: 100%;
        height: 2px;
        position: absolute;
        top: 0;
        background: url('../assets/images/tabs-bg.svg') no-repeat;
    }
    :deep(.el-tabs__nav-scroll::after) {
        content: '';
        width: 100%;
        height: 2px;
        position: absolute;
        bottom: 0;
        left: 0;
        background: url('../assets/images/tabs-bg.svg') no-repeat;
    }

    :deep(.el-tabs__nav-wrap:after) {
        height: 0;
    }

    :deep(.el-tabs__item) {
        // font-weight: 400;
        // color: rgba(201, 233, 248, 0.6);
        // line-height: 16px;
        // @include ALIBABAPUHUITIREGULAR(12px);
        color: rgba(201, 233, 248, 0.8);
        @include ALIBABAPUHUITIREGULAR(16px);
        .custom-tabs-label {
            display: flex;
            align-items: center;
            >img {
                width: 30px;
                height: 30px;
            }
        }
    }

    :deep(.el-tabs__item.is-active) {
        @include ALIBABAPUHUITIBOLD(16px);
        background: linear-gradient(180deg, #ffffff 0%, #50caff 97%);
       -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        text-fill-color: transparent; 
        .marker {
            width: 8px;
            height: 8px;
            border-radius: 50%;
            background: #EAB309;
        }
        .marker-before {
            margin-right: 3px;
        }
        .marker-after {
            margin-left: 3px;
        }
    }

    :deep(.el-tabs__nav-wrap.is-scrollable) {
        padding: 0 30px;
    }

    :deep(.el-tabs__nav-prev) {
        background: url('@/assets/images/prev.svg');
    }
    :deep(.el-tabs__nav-prev:hover) {
        background: url('@/assets/images/prevhover.svg');
    }

    :deep(.el-tabs__nav-next) {
        background: url('@/assets/images/next.svg');
    }
    :deep(.el-tabs__nav-next:hover) {
        background: url('@/assets/images/nexthover.svg');
    }

    :deep(.el-tabs__nav-prev),
    :deep(.el-tabs__nav-next) {
        width: 31px;
        height: 37px;
        background-size: 100% 100%;
        margin-top: 2px;

        .el-icon {
            display: none;
        }
    }
}